<template>
  <section>
    <div style="text-align:center; backgroundColor: #fff;">
      <!-- <img style="width: 55%;" src="../assets/main.jpg" alt=""> -->
        <h1  class="title1">欢迎使用，商户管理系统！</h1>
          <div  class="content">
                    <table >
                        <tbody ><tr  class="first">
                            <td >针对商户、承兑商账户统一管理</td>
                            <td  style="border:none"></td>
                            <td >针对交易商数据交易及会员资金数据查询操作</td>
                            <td  style="border:none"></td>
                            <td >针对后台系统相关的权限管理</td>
                            <td  style="border:none"></td>
                        </tr>
                        <tr  class="second">
                            <td >账户管理</td>
                            <td  style="border:none"></td>
                            <td >统计查询</td>
                            <td  style="border:none"></td>
                            <td >权限管理</td>
                            <td  style="border:none"></td>
                        </tr>
                        <tr  class="third">
                            <td ><img  alt="" src="../assets/img/account.png"></td>
                            <td ><img  alt="" src="../assets/img/money.png"></td>
                            <td ><img  alt="" src="../assets/img/statistics.png"></td>
                            <td ><img  alt="" src="../assets/img/statement.png"></td>
                            <td ><img  alt="" src="../assets/img/permission.png"></td>
                            <td ><img  alt="" src="../assets/img/system.png"></td>
                        </tr>
                        <tr  class="fourth">
                            <td  style="border:none"></td>
                            <td >资金管理</td>
                            <td  style="border:none"></td>
                            <td >报表查询</td>
                            <td  style="border:none"></td>
                            <td >系统管理</td>
                        </tr>
                        <tr  class="fifth">
                            <td  style="border:none"></td>
                            <td >针对交易商出入金及会员出入金统一管理</td>
                            <td  style="border:none"></td>
                            <td >针对交易商及会员报表查询</td>
                            <td  style="border:none"></td>
                            <td >针对后台系统级别相关的管理</td>
                        </tr>
                    </tbody></table>
                </div>
                <div  class="bottom">  
                    <p >Version 3.0.1.6</p>
                    <p >版权所有 Copyright (c) 2018 All Rights Reserved. </p>
                </div>
    </div>
  </section>
</template>
<script>
  export default {
    data(){
      return{
        itemArr: [0] ,
        sda: ''
      }
    },
    methods:{
      //点击添加
      addExceptPrice() {
        console.log(111)
          this.ele ++;
          this.itemArr.push(this.ele)
      },
      //删除一项
      deleteExceptPrice(index) {
          this.itemArr.splice(index, 1);
      }
    }
  }

</script>
<style>
   .blur {	
      
      position: absolute;
      left:50%;
      top:50%;
      margin-left:-10%;
      margin-top:0;
}
.title1 {
    text-align: center;
    margin: 12vh 0 7vh 0;
    font-size: 35px;
}
.content {
    width: calc(100vw - 250px);
    overflow-x: hidden;
    margin: 20px auto 0;
}
@media (max-width: 980px){
    .content {
        width: 100%;
        margin: 0 auto;
    }
}
.content table {
    width: 75%;
    margin: 0 auto;
}
.fifth td, .first td {
    border-left: 5px solid #5fc8e8;
    width: 16.66666%;
    word-break: break-all;
    line-height: 20px;
    padding: 10px 5px;
}
.fifth td, .first td {
    border-left: 5px solid #5fc8e8;
    width: 16.66666%;
    word-break: break-all;
    line-height: 20px;
    padding: 10px 5px;
}
.fourth td, .second td {
    border-left: 1px solid #5fc8e8;
    width: 16.66666%;
    word-break: break-all;
    font-size: 20px;
    font-weight: 700;
    padding: 15px 0;
}
.content .third td {
    border: 1px solid #5fc8e8;
    padding: 20px 0;
}
.bottom {
    width: calc(100vw - 250px);
    text-align: center;
    margin-bottom: 10vh;
    margin-top: 10vh;
    bottom: 0;
}
</style>
